<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
	<title></title>
	<link rel="stylesheet" href="./css/swiper.min.css">
	<link rel="stylesheet" href="css/index.css">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="font/iconfont.css">
</head>

<body>
	<div class="wrap">
		<div class="header">
			<span class="iconfont icon-xiaoxi
				"></span>
			<h6>ALLPYRA</h6>
			<a href="" class="iconfont icon-sousuo
				"></a>
		</div>
		<div class="main">
			<div class="swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide"><img src="img/banner.jpg" alt=""></div>
					<div class="swiper-slide"><img src="img/banner1.jpg" alt=""></div>
					<div class="swiper-slide"><img src="img/banner.jpg" alt=""></div>
					<div class="swiper-slide"><img src="img/banner1.jpg" alt=""></div>
				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination"></div>
				<!-- Add Arrows -->
				<div class="swiper-button-next"></div>
				<div class="swiper-button-prev"></div>
			</div>

			<!-- 菜单 -->
			<div class="menu">
				<section class="menu-list">
					<span class="iconfont icon-miaosha"></span>
					<p>每日秒杀</p>
				</section>
				<section class="menu-list">
					<span class="iconfont icon-lingquan"></span>
					<p>领券中心</p>
				</section>
				<section class="menu-list">
					<span class="iconfont icon-shouye_haowukong"></span>
					<p>新人专享</p>
				</section>
				<section class="menu-list">
					<span class="iconfont icon-haowutuijian"></span>
					<p>上新好物</p>
				</section>

			</div>
			<div class="banner">
				<img src="img/bg.png" alt="">
			</div>
			<div class="nav">
				<img src="img/list1.jpg" alt="">
				<div class="nav-list">
					<ul class="ul-wrap">
						<li><img src="img/list1-1.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list1-2.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list1-3.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list1-4.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list1-5.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list1-6.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						
					</ul>
				</div>
			</div>
			<div class="nav nav1">
				<img src="img/list2.jpg" alt="">
				<div class="nav-list">
					<ul class="ul-wrap">
						<li><img src="img/list2-1.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list2-2.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list2-3.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						<li><img src="img/list2-4.jpg" alt=""><h6>INNISFREE悦诗风吟绿茶保湿平衡两件套盒</h6><span>￥168</span></li>
						
					</ul>
				</div>
				
			</div>
			<div class="hotGood">
				<h2>/  全  球  必  买  /</h2>
				<span>HOT  GOOD</span>
				<div class="hotGood-list">

					<!-- <ul class="hot">

						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润
							 修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润
							 修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润
							 修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
						<li><img src="img/img1.jpg" alt=""><h6>Estee Lauder 雅诗兰黛 特润
							 修护肌透精华露 小棕瓶</h6><span>￥980</span><p>美国</p></li>
					</ul> -->
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
				    
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
						<div class="hot">
							<img src="img/img1.jpg" alt="">
							<h6>Estee Lauder雅诗兰黛特润<br> 
							修护肌透精华露 小棕瓶</h6><span>￥980</span><i>美国</i></li>
						</div>
				   
				</div>
				
			</div>
			
		</div>

		<!-- 底部 -->
		<div class="footer">
			<a href="" class="active"><img src="img/tab1-2.png" alt=""><span>首页</span></a>
			<a><img src="img/tab2.png" alt=""><span>分类</span></a>
			<a><img src="img/tab3.png" alt=""><span>购物车</span></a>
			<a><img src="img/tab4.png" alt=""><span>我的</span></a>

		</div>
	</div>
</body>
<script src="./js/swiper.min.js"></script>

<!-- Initialize Swiper -->
<script>
	var swiper = new Swiper('.swiper-container', {
		pagination: '.swiper-pagination',
		nextButton: '.swiper-button-next',
		prevButton: '.swiper-button-prev',
		paginationClickable: true,
		spaceBetween: 30,
		autoplay: 2500,
		autoplayDisableOnInteraction: false
	});
</script>

</html>